///当浏览器完成 HTML 文档的解析（即 DOM 树已经构建完成）后，就会触发 DOMContentLoaded 事件。
///它比 window.onload 更早触发，因为 window.onload 会等到页面上所有资源（包括图片、样式、脚本等）都加载完成后才触发
document.addEventListener('DOMContentLoaded', function () {  
    document.getElementById('home').addEventListener('click', function (event) {
        event.preventDefault();
        alert('首页被点击');
        console.log(`首页被点击`);

        // 添加逻辑
    });

    document.getElementById('about').addEventListener('click', function (event) {
        // event.preventDefault();
        alert('关于被点击');
        console.log(`关于被点击`);
        // 添加逻辑
    });

    document.getElementById('service').addEventListener('click', function (event) {
        // event.preventDefault();
        alert('服务被点击');
        console.log(`服务被点击`);

        // 添加逻辑
    });

    document.getElementById('contact').addEventListener('click', function (event) {
        // event.preventDefault();
        alert('联系被点击');
        console.log(`联系被点击`);
        // 添加逻辑
    });
});
